import React, { type FC } from 'react';
import './card-box.less';

const classPrefix = `bbt-react-cardbox`;

export type CardBoxProps = {
  className?: string;
  styles?: React.CSSProperties;
  children: React.ReactNode;
  title?: string | React.ReactNode;
};

/**
 * @description 一个简单的卡片组件
 */
export const CardBox: FC<CardBoxProps> = ({
  className = '',
  styles = {},
  children,
  title,
}) => {
  return (
    <div
      className={`${classPrefix} ${className}`}
      style={{
        ...styles,
      }}
    >
      {title ? <div className={`${classPrefix}-title`}>{title}</div> : null}
      {children}
    </div>
  );
};
